<script lang="ts" setup>
defineOptions({
  name: 'LayoutMain',
})
</script>

<template>
  <section class="h-full min-w-225 w-full flex">
    <div v-if="$slots.aside" class="h-full min-w-60 w-60 flex">
      <slot name="aside" />
    </div>
    <div class="h-full flex flex-col" :style="{ width: $slots.aside ? 'calc(100% - 240px)' : '100%' }">
      <div v-if="$slots.nav">
        <slot name="nav" />
      </div>
      <div class="w-full flex flex-1 overflow-hidden">
        <slot name="main" />
      </div>
    </div>
  </section>
</template>

<style lang="scss" scoped></style>
